<!--
 * @Descripttion: 报警信息列表
 * @LastEditors: xzh
 * @LastEditTime: 2024-07-02 00:54:52
-->
<template>
  <DileLayer
    v-model="alarmInfoParam.visible"
    :layerWidth="600"
    :layerHeight="600"
    :footerVisible="false"
    :title="$t('page.equipManageArr.equipTypeArr.alarmInfo')"
  >
    <div class="alarmInfo-list">
      <DileTable ref="dileTableRef">
        <template #preBtn>
          <el-upload
            :show-file-list="false"
            :auto-upload="false"
            :on-change="handleFileUpload"
            :limit="1"
          >
            <el-button type="success" plain>
              {{ $t("table.btnArr.import") }}</el-button
            >
          </el-upload>
        </template>
        <template #preColumn>
          <vxe-column
            field="alarmName"
            :title="
              $t('page.equipManageArr.equipTypeArr.alarmInfoArr.alarmName')
            "
          />
          <vxe-column
            field="alarmLevel"
            :title="
              $t('page.equipManageArr.equipTypeArr.alarmInfoArr.alarmLevel')
            "
            width="80"
          />
          <vxe-column
            field="alarmDescription"
            :title="
              $t(
                'page.equipManageArr.equipTypeArr.alarmInfoArr.alarmDescription'
              )
            "
          />
        </template>
      </DileTable>
    </div>
  </DileLayer>
</template>

<script setup lang="ts">
import { object_Inf } from "@/utils/typings/index.type";
import { ref, reactive, provide, toRefs } from "vue";
import { useI18n } from "vue-i18n";
import { propsParam_Inf } from "@/components/dile-table/index.type";
import { btnTypeEnum } from "@/components/dile-table/index.type";
import { ElNotification, UploadFile, UploadFiles } from "element-plus";
import DileLayer from "@/components/dile-layer/index.vue";
import DileTable from "@/components/dile-table/index.vue";
import Dile_APi from "@/api";
import Dile_Methods from "@/utils/methods";
/**
 * @Author: xzh
 * @Descripttion:i18n实例
 * @Param:
 */
let { t } = useI18n();

/**
 * @Author: xzh
 * @Descripttion: 报警信息列表参数
 * @Param:
 */
let alarmInfoParam = reactive<object_Inf>({
  visible: false,
  typeId: null,
});

/**
 * @Author: xzh
 * @Descripttion: 初始化
 * @Param:
 */
let init = (typeId: number) => {
  Object.assign(alarmInfoParam, {
    visible: true,
    typeId,
  });
  //加载报警信息信息
  initAlarmInfoList();
};
/**
 * @Author: xzh
 * @Descripttion:加载报警信息信息
 * @Param:
 */
let initAlarmInfoList = async () => {
  let { loading } = toRefs(propsParam),
    { typeId } = alarmInfoParam;
  try {
    loading.value = true;

    let tableData = await Dile_APi.getEquipTypeAlarmInfoList(typeId);

    Object.assign(propsParam, {
      tableData,
    });
  } finally {
    loading.value = false;
  }
};
/**
 * @Author: xzh
 * @Descripttion:工具栏按钮点击事件
 * @Param:
 * @param {*} event
 */
let handleToolBtnClick = async (event: object_Inf) => {
  let { code } = event,
    { typeId } = alarmInfoParam,
    { loading } = toRefs(propsParam);
  try {
    loading.value = true;
    switch (code) {
      case "export":
        //导出
        let res = await Dile_APi.exportEquipAbnormalInfo(typeId);
        Dile_Methods.handleFile(res);
        break;
    }
  } finally {
    loading.value = false;
  }
};

/**
 * @Author: xzh
 * @Descripttion: 文件上传
 * @Param:
 */
let handleFileUpload = async (
  uploadFile: UploadFile | object_Inf,
  uploadFileList: UploadFiles
) => {
  let formData = new FormData(),
    { typeId } = alarmInfoParam;

  formData.append("Files", uploadFile.raw);
  formData.append("Typeld", typeId);
  await Dile_APi.uploadEquipAbnormalInfo(formData);
  ElNotification({
    title: "成功",
    message: "上传成功！",
    type: "success",
  });
  //刷新异常信息表格
  await initAlarmInfoList();
};

/**
 * @Author: xzh
 * @Descripttion: 表格参数
 * @Param:
 */
let propsParam = reactive<propsParam_Inf>({
  loading: false,
  tableData: [],
  tableToolArr: [
    {
      // t("table.btnArr.export"),
      label: "table.btnArr.export",
      code: "export",
      btnType: btnTypeEnum.button,
      customBehavior: true,
    },
  ],
  emitEvents: {
    toolBtnClick: handleToolBtnClick,
  },
});
provide("propsParam", propsParam);

/**
 * @Author: xzh
 * @Descripttion: 暴露方法
 * @Param:
 */
defineExpose({
  init,
});
</script>
<style lang="scss" scoped>
.alarmInfo-list {
  height: 100%;
  padding: 1rem;
}
</style>
